<template>
	<view class='page-body'>
		<view class="login-header">
			<statusBar></statusBar>
		</view>
		<view class="login-cell">
			<image src="/static/assert/account-icon.png" style='width:41upx;height:41upx;margin-left: 22upx;margin-right: 4upx;'></image>
			<input type="text" placeholder='请输入手机号' placeholder-class='input-placeholder' class='input' v-model='account' />
		</view>
		<view class="login-cell">
			<image src='/static/assert/pass-login.png' style='width:33upx;height:41upx;margin-left: 26upx;' />
			<input class='input' type="text" password value="" placeholder-class='input-placeholder' :placeholder='lang.Pleaseenter'
			 v-model='password' />
		</view>
		<view class='login-button'>
			<button @tap="onlogin">{{lang.login}}</button>
		</view>
		<view class='links' @tap="$nav('./findPass')">{{lang.Forgot}}？</view>
		<view class='foot'>
			<view class='to-register' @tap="$nav('./register')">{{lang.Noaccount}}</view>
            <view class='login-back'>
            	<button @tap='back'>返回主页</button>
            </view>
		</view>
	</view> 
</template>

<script>
	var wv;
    import md5 from 'js-md5';
	import {mapActions,mapState} from 'vuex';
	import { toast } from '@/utils/toast';
	import request from '@/utils/request';
	export default {
		data() {
			return {
				current: 0,
				account: '',
				password: '',
				type: 0,
			} 
		},
		created() {

		},
		computed: {
			...mapState(['lang']),
			...mapState('user', ['LOGIN_INFO']),
		},
		methods: {
			...mapActions('user', ['loginInfo']),
			siwperChange(e) {

				this.current = e.detail.current

			},
			radioChange(event) {

			},
            back(){
                uni.switchTab({
                    url:"/pages/quotation/main"
                })
            },
			// 登录
			onlogin() {				
				 	request('/customers/account/login', 'POST', {
				 		guid:"001",
						loginId:this.account,
						hashedPassword:md5(this.password),
						ip:"555"
				 	}).then(res => {	
						console.log(res.data,222)
				 		  if(res.data.ResultCD=="I001"){
							 this.$store.commit('user/LOGIN_INFO', res.data);							
				 			uni.switchTab({
				 			    url:"/pages/quotation/main"
				 			})
				 			
				 		}else{
							toast(res.data.ErrorMsg);
						}
				 		
				 	});
				 
			}

		},
		

	}
</script>

<style lang="scss" scoped>
	.login-header {
		height: 340upx;
		padding: 0 30upx;

		.back-head {
			height: 90upx;
			line-height: 90upx;

			image {
				width: 17upx;
				height: 31upx;
				vertical-align: middle;
			}
		}

	}

	.page-body {
		background: linear-gradient(232deg, rgba(104, 129, 255, 1), rgba(115, 156, 255, 1));
		min-height: 100%;
	}

	uni-page-body {
		height: 100%;
	}

	.login-cell {
		display: flex;
		align-items: center;
		margin: 0 auto;
		width: 543px;
		height: 87px;
		background: rgba(140, 167, 255, 1);
		border-radius: 10px;
		margin-bottom: 52upx;

		image {}

		.input {
			font-size: 26upx;
			font-family: PingFang-SC-Regular;
			font-weight: 400;
			color: rgba(254, 254, 254, 1);
			padding: 0 35upx;
		}

		.input-placeholder {
			font-size: 26px;
			font-family: PingFang-SC-Regular;
			font-weight: 400;
			color: rgba(254, 254, 254, 1);
		}


	}

	.login-button {
		button {
			width: 543px;
			height: 87px;
			line-height: 87upx;
            background: #f2f2f2;
            color: rgba(140, 167, 255, 1);
			border-radius: 10px;
			border: 0;
			outline: none;
			font-size: 28px;
			font-family: PingFang-SC-Medium;
			font-weight: 500;
		}
	}

	.links {
		font-size: 22px;
		font-family: PingFang-SC-Medium;
		font-weight: 500;
		color: rgba(255, 255, 255, 1);
		text-align: center;
		margin-top: 25upx;
	}

	.foot {
		width: 100%;
		position: fixed;
		top: 780upx;
        text-align: center;
        button {
           width: 543px;
           height: 87px;
           line-height: 87upx;
           // background: rgba(140, 167, 255, 1);
           background: rgba(140, 167, 255, 1);
           border: 1px solid rgba(140, 167, 255, 1);
           border-radius: 10px;
           
           border: 0;
           outline: none;
           font-size: 28px;
           font-family: PingFang-SC-Medium;
           font-weight: 500;
           color: rgba(217, 226, 255, 1);
        }
		.to-register {
			font-size: 28px;
			font-family: PingFang-SC-Medium;
			font-weight: 500;
			color: rgba(255, 255, 255, 1);
			text-align: center;
		}
	}
</style>
